<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <title>管理工程与商学院</title><!-- 栏目名称 -->
    <link rel="stylesheet" href="css/style.css">
</head>

<body>
    <div class="container">
    <div class="header">
        <div class="logo"></div>
        <div class="navbar">
            <ul class="navbar-item">
                <li><a href="#">首页</a></li>
                <li><a href="#">学院概况</a>
                    <ul class="dropdown-menu">
                        <li><a href="#">学院简介</a></li>
                        <li><a href="#">现任领导</a></li>
                        <li><a href="#">机构设置</a></li>
                        <li><a href="#">院学术委员会</a></li>
                    </ul>
                </li>
                <li><a href="#">党建思政</a>
                <ul class="dropdown-menu">
                        <li><a href="#">学院简介</a></li>
                        <li><a href="#">现任领导</a></li>
                        <li><a href="#">机构设置</a></li>
                        <li><a href="#">院学术委员会</a></li>
                    </ul></li>
                <li><a href="#">师资队伍</a>
                <ul class="dropdown-menu">
                        <li><a href="#">学院简介</a></li>
                        <li><a href="#">现任领导</a></li>
                        <li><a href="#">机构设置</a></li>
                        <li><a href="#">院学术委员会</a></li>
                    </ul></li>
                <li><a href="#">本科生教育</a>
                <ul class="dropdown-menu">
                        <li><a href="#">学院简介</a></li>
                        <li><a href="#">现任领导</a></li>
                        <li><a href="#">机构设置</a></li>
                        <li><a href="#">院学术委员会</a></li>
                    </ul></li>
                    
                <li><a href="#">研究生教育</a></li>
                <li><a href="#">学科建设</a></li>
                <li><a href="#">科学研究</a></li>
                <li><a href="#">学生工作</a></li>
                <li><a href="#">招生就业</a></li>
                <li><a href="#">下载中心</a></li>
            </ul>
        </div>
    </div>
    <!-- adv图片 -->
    <div class="pic">
        <img src="images/article_banner.jpg" alt="">
    </div>
    <div class="content">
        <!-- 左侧子栏目区域 -->
        <div class="subnav fr">
            <h3>子栏目名称</h3>
            <div class="line"></div>
            <ul>
                <li class="active"><a href="#">子栏目1</a></li>
                <li><a href="#">子栏目2</a></li>
                <li><a href="#">子栏目3</a></li>
                <li><a href="#">子栏目4</a></li>
            </ul>
        </div>
        <!-- 右侧列表区域 -->
        <div class="list-container">
            <div class="nav-path">
                当前位置：
                <a href="#">首页</a>/
                <a href="#">新闻中心</a>/通知公告
            </div>
            <div class="line"></div>
            <div class="news-list">
                <ul>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                    <li>
                        <a href="">管商学院举办四六级英语考试</a>
                        <span>2017-05-01</span>
                    </li>
                </ul>
            </div>
            <div class="line"></div>
            <div class="page-list">
                <p><a href="#">第一页</a> | 上一页 | 1 2 3 4 5 | 下一页 | 最后一页</p>
            </div>
        </div>
        <div class="clb"></div>
    </div>

    <div class="footer">
       <div class="favlink">
            <ul>
                <li><a href="">河北工程大学</a></li>
                <li><a href="">北大光华管理学院</a></li>
                <li>
                    <a href=""></a>
                </li>
                <li>
                    <a href=""></a>
                </li>
                <li>
                    <a href=""></a>
                </li>
                <li>
                    <a href=""></a>
                </li>
                <li>
                    <a href=""></a>
                </li>
                <li>
                    <a href=""></a>
                </li>
            </ul>
        </div>
        <div class="line"></div>
        <div class="copyright">
            <p>河北工程大学管理工程与商学院&nbsp;版权所有&nbsp;|&nbsp;地址：河北省邯郸市河北工程大学西校园9教</p>
            <p>联系电话：0310-8578778 &nbsp; 管理维护：赵记涛</p>
        </div>
    </div>
    </div>
    <script src="js/jquery-1.10.2.min.js"></script>
    <script>
        $(document).ready(function () {
            $(".navbar ul li").mouseenter(function () {

                $(this).find(".dropdown-menu").fadeIn(500)

            })
            $(".navbar ul li").mouseleave(function () {

                $(this).find(".dropdown-menu").fadeOut(500)

            })
        });
    </script>
</body>

</html>